<template>
	<betting-odds :value="odds" at />
</template>

<script lang="ts" setup>
import { computed } from 'vue'
import BettingOdds from '../betting-odds/index.vue'
import { useBettingConfigStore } from '@/store'
import { floor } from 'lodash-es'

const props = defineProps({
	data: {
		type: Array<number>,
		default: () => []
	}
})

const bettingConfigStore = useBettingConfigStore()

const odds = computed(() => {
	let res = 0
	let comboHasLowOdds = false
	props.data.forEach((item) => {
		if (!res) {
			res = 1
		}
		res *= item
		if (item < bettingConfigStore.comboBonusMinTrueOdds) {
			comboHasLowOdds = true
		}
	})
	res = floor(res, 2)
	if (!comboHasLowOdds && res) {
		const comboBonus = bettingConfigStore.comboBonus
		for (let index = comboBonus.length - 1; index >= 0; index--) {
			const { number, percent } = comboBonus[index]
			if (props.data.length >= number) {
				return res + (res * parseFloat(percent)) / 100
			}
		}
	}
	return res
})
</script>
